<template>
  <div>
    <div class="app-container">
      <div class="search-container">
        <el-form :inline="true" :model="hybridizationquerys" class="demo-form-inline">
          <el-form-item label="种母耳号">
            <el-input v-model="hybridizationquerys.earTag" placeholder="种母耳号" />
          </el-form-item>
          <el-form-item label="配种日期">
            <el-date-picker v-model="hybridizationquerys.sdate" type="date" placeholder="选择开始日期" />—
            <el-date-picker v-model="hybridizationquerys.edate" type="date" placeholder="选择结束日期" />
          </el-form-item>
          <el-form-item label="负责人">
            <el-select v-model="hybridizationquerys.userId" ps style="width:100px">
              <el-option :value=0 label="请选择">请选择</el-option>
              <el-option :value=1 label="刘永刚">刘永刚</el-option>
              <el-option :value=2 label="孟盘龙">孟盘龙</el-option>
              <el-option :value=3 label="赵秋实">赵秋实</el-option>
              <el-option :value=4 label="牛骞若">牛骞若</el-option>
              <el-option :value=5 label="赵思彤">赵思彤</el-option>
              <el-option :value=6 label="于晋哲">于晋哲</el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="GethybridizationList">查询</el-button>
            <el-button type="danger" :icon="Delete" @click="DelRange">批量删除</el-button>

            <el-button type="success" @click="addHyBridization()">新增</el-button>

          </el-form-item>

        </el-form>

        <el-table :data="tableData" style="width: 100%" @selection-change="handleSelectionChange">
          <el-table-column type="selection" width="55" />
          <el-table-column prop="breedId" label="序号" />
          <el-table-column prop="" label="配种日期">
            <template v-slot="scope">
              {{ scope.row.breedDate.substring(0, 10) }}
            </template>
          </el-table-column>
          <el-table-column prop="address" label="上一次配种日期">
            <template v-slot="scope">
              {{ scope.row.lastBreedDate.substring(0, 10) }}
            </template>

          </el-table-column>
          <el-table-column prop="earTag" label="耳号" />
          <el-table-column prop="motherVariety" label="种母品种">
            <template v-slot="scope">
              <span v-if="scope.row.motherVariety == 1">杜泊</span>
              <span v-else-if="scope.row.motherVariety == 2">澳洲白</span>
              <span v-else-if="scope.row.motherVariety == 3">萨福克</span>
              <span v-else-if="scope.row.motherVariety == 4">杜湖</span>
              <span v-else-if="scope.row.motherVariety == 5">杜杜湖</span>
              <span v-else-if="scope.row.motherVariety == 6">萨杜湖</span>
              <span v-else-if="scope.row.motherVariety == 7">澳湖</span>
              <span v-else-if="scope.row.motherVariety == 8">湖羊</span>
              <span v-else-if="scope.row.motherVariety == 9">澳杜湖</span>
            </template>

          </el-table-column>
          <el-table-column prop="firstMatingRam" label="首配公羊" />
          <el-table-column prop="maleBreed" label="种公品种">
            <template v-slot="scope">
              <span v-if="scope.row.maleBreed == 1">杜泊</span>
              <span v-else-if="scope.row.maleBreed == 2">澳洲白</span>
              <span v-else-if="scope.row.maleBreed == 3">萨福克</span>
              <span v-else-if="scope.row.maleBreed == 4">杜湖</span>
              <span v-else-if="scope.row.maleBreed == 5">杜杜湖</span>
              <span v-else-if="scope.row.maleBreed == 6">萨杜湖</span>
              <span v-else-if="scope.row.maleBreed == 7">澳湖</span>
              <span v-else-if="scope.row.maleBreed == 8">湖羊</span>
              <span v-else-if="scope.row.maleBreed == 9">澳杜湖</span>
            </template>

          </el-table-column>
          <el-table-column prop="" label="配种方式">
            <template v-slot="scope">
              <span v-if="scope.row.breedStyle == 1">鲜精-阴道</span>
              <span v-else-if="scope.row.breedStyle == 2">鲜精-子宫角</span>
              <span v-else-if="scope.row.breedStyle == 3">冻精-阴道</span>
              <span v-else-if="scope.row.breedStyle == 4">冻精-子宫角</span>
              <span v-else-if="scope.row.breedStyle == 5">模糊本交</span>
              <span v-else-if="scope.row.breedStyle == 6">精准本交</span>
            </template>

          </el-table-column>
          <el-table-column prop="" label="种母发情类型">
            <template v-slot="scope">
              <span v-if="scope.row.oestrusType == 1">自然发情</span>
              <span v-else-if="scope.row.oestrusType == 2">同期发情</span>
            </template>


          </el-table-column>
          <el-table-column prop="firstScore" label="首配评分" />
          <el-table-column prop="currentBuildName" label="当前栋舍" />
          <el-table-column prop="currentColumName" label="当前栏位" />
          <el-table-column prop="toBulidName" label="转入栋舍" />
          <el-table-column prop="toColumName" label="转入栏位" />
          <el-table-column prop="" label="繁殖状态">
            <template v-slot="scope">
              <span v-if="scope.row.breedState == 1">后备空怀</span>
              <span v-else-if="scope.row.breedState == 2">返情空怀</span>
              <span v-else-if="scope.row.breedState == 3">未孕空怀</span>
              <span v-else-if="scope.row.breedState == 4">流产空怀</span>
              <span v-else-if="scope.row.breedState == 5">空胎空怀</span>
              <span v-else-if="scope.row.breedState == 6">断奶空怀</span>
              <span v-else-if="scope.row.breedState == 7">妊娠</span>
              <span v-else-if="scope.row.breedState == 8">哺乳</span>
            </template>

          </el-table-column>
          <el-table-column prop="" label="事件日期">
            <template v-slot="scope">
              {{ scope.row.eventDate.substring(0, 10) }}
            </template>
          </el-table-column>
          <el-table-column prop="userId" label="负责人">
            <template #default="scope">
              <span v-if="scope.row.userId == 1">刘永刚</span>
              <span v-else-if="scope.row.userId == 2">孟盘龙</span>
              <span v-else-if="scope.row.userId == 3">赵秋实</span>
              <span v-else-if="scope.row.userId == 4">牛骞若</span>
              <span v-else-if="scope.row.userId == 5">赵思彤</span>
              <span v-else-if="scope.row.userId == 6">于晋哲</span>
            </template>

          </el-table-column>
          <el-table-column prop="createName" label="创建人" />
          <el-table-column prop="address" label="创建时间">
            <template v-slot="scope">
              {{ scope.row.createTime.substring(0, 10) }}
            </template>
          </el-table-column>
          <el-table-column prop="updateName" label="修改人" />
          <el-table-column prop="address" label="修改时间">
            <template v-slot="scope">
              {{ scope.row.updateTime.substring(0, 10) }}
            </template>
          </el-table-column>
          <el-table-column prop="documentNumber" label="单据号" />

          <el-table-column prop="" label="操作" fixed="right">
            <template v-slot="scope">
              <!--<el-link :icon="Edit" type="primary" @click="edit(scope.row)">编辑</el-link>&emsp;-->
              <el-link :icon="Delete" type="danger" @click="del(scope.row.breedId)">删除</el-link>
            </template>
          </el-table-column>
        </el-table>
        <div class="demo-pagination-block">
          <el-pagination v-model:current-page="hybridizationquerys.pageIndex"
            v-model:page-size="hybridizationquerys.pageSize" :page-sizes="[2, 3, 4, 5]" :background="true"
            layout="total, sizes, prev, pager, next, jumper" prev-text="上一页" next-text="下一页" :total="page.totalCount"
            @size-change="handleSizeChange" @current-change="handleCurrentChange" />

        </div>

      </div>
    </div>
  </div>
</template>
<script setup lang="ts">
import { useRouter } from 'vue-router'
const router = useRouter();
//种母配种
import hybridization from '@/api/Hybridization/index'
import { hybridizationquery } from '@/api/Hybridization/model'
import {

  Delete,
  Edit,
  Search,

} from '@element-plus/icons-vue'
//对话框
const dialogVisible = ref(false)
//参数
const hybridizationquerys = reactive<hybridizationquery>({
  earTag: "",
  pageIndex: 1,
  pageSize: 15,
  sdate: "",
  edate: "",
  userId: 0,
})
//分页
const page = reactive({
  pageCount: 0,
  totalCount: 0
})
const handleSizeChange = (val: number) => {
  hybridizationquerys.pageSize = val
  GethybridizationList()
}
const handleCurrentChange = (val: number) => {
  hybridizationquerys.pageIndex = val;
  GethybridizationList()
}

//显示
const tableData: any = ref([])
const GethybridizationList = () => {
  hybridization.getList(hybridizationquerys).then((res: any) => {
    console.log('完整响应数据:', res);
    tableData.value = res.data.data
    page.pageCount = res.data.pageCount
    page.totalCount = res.data.totalCount
  })
}
onMounted(() => {
  GethybridizationList()
})

//删除
const del = (id: number) => {
  ElMessageBox.confirm(
    '确认删除吗?',
    '警告',
    {
      confirmButtonText: '确认',
      cancelButtonText: '取消',
      type: 'warning',
    }
  ).then(() => {
    hybridization.deleteHybridization(id).then((res: any) => {
      ElMessage({
        message: res.msg,
        type: 'success',
      })
      GethybridizationList()
    })
  }).catch(() => {
    ElMessage({
      type: 'info',
      message: '取消删除',
    })
  })

}




const idlist: any = ref([])
//已选择几项  
const checked = ref(0)
const handleSelectionChange = (val: any) => {
  checked.value = val.length; // 更新选中项的数量

  // 如果需要获取选中项的 ID 列表，可以进一步处理
  idlist.value = val.map((item: any) => item.breedId); // 假设每个选中项有一个唯一的 id 属性

}
//批量删除
const DelRange = () => {
  console.log(idlist.value)

  if (checked.value == 0) {
    ElMessage({
      message: '请选择要删除的项',
      type: 'warning',
    })
    return;
  }
  ElMessageBox.confirm(
    '确认批量删除吗?',
    '警告',
    {
      confirmButtonText: '确认',
      cancelButtonText: '取消',
      type: 'warning',
    }
  ).then(() => {
    hybridization.deleteBatchHybridization(idlist.value).then((res: any) => {
      ElMessage({
        message: res.msg,
        type: 'success',
      })
      GethybridizationList()
    })
  }).catch(() => {
    ElMessage({
      type: 'info',
      message: '取消删除',
    })
  })


}
//跳转页面

const addHyBridization = () => {
  router.push({
    name: 'AddHyBridization'
  })

}

</script>
